import {useState} from "react";

function Son({message, callback}) {

    return (
        <div>
            <div>Son received props: {message}</div>
            <button onClick={callback}>Click Me!</button>
        </div>
    )
}


function Father() {
    const [parentValue, setParentValue] = useState('old')
    const callback = () => {
        console.log("Callback executed!");
        setParentValue("New")
    }
    return (
        <div>
            <div>Father: {parentValue}</div>
            <Son message={parentValue} callback={callback}>
                <span>test</span>
            </Son>
        </div>
    )
}

export default Father;
